<template>
	<div>
		<el-table v-on="$listeners" :data="tableDatas" border fit highlight-current-row :row-key="rowKey" default-expand-all>
			<div v-for="(row, key) in columnsData" :key="key">
				<slot v-if="row.type=='slot'" :name="row.name" />
				<XcTableColumnIndex :row="row" v-if="['index','selection'].includes(row.type)" />
				<XcTableColumnDefault :row="row" v-if="!row.type" />
				<XcTableColumnTag :row="row" v-if="['tag'].includes(row.type)" />
				<XcTableColumnImg :row="row" v-if="['img'].includes(row.type)" />
				<XcTableColumnInputNumber :row="row" v-if="['number'].includes(row.type)" />
				<XcTableColumnButton :row="row" v-if="['button'].includes(row.type)" />
			</div>
		</el-table>
	</div>
</template>

<script>
	export default {
		name: "ElColumns",
		inject: ["vm"],
		props: {
			list: {
				type: Array,
				default () {
					return [];
				},

			},
			option: String,
			rowKey: {
				type: String,
				default () {
					return "id";
				},
			},
		},
		computed: {
			tableDatas() {
				return this.vm.list;
			},
			columnsData() {
				try {
					if (this.option) return this.vm[this.option];
					return this.vm.pageDatas.data;
				} catch (error) {
					console.log('error', error);
					this.$toast("未设置表格列");
				}
			}
		},
		methods: {},
	};
</script>

<style>
</style>